﻿using System;

namespace RexToy.UI.Controls
{
    public class DropDownList : Control
    {
        public override bool Standalone
        {
            get
            {
                return __standalone;
            }
            set
            {
                var btn = this.__domNode.SearchByName("btn");
                var spn = this.__domNode.SearchByName("spn");
                if (value)
                {
                    btn.AppendClass("ui-btn-corner-all");
                    btn.AppendClass("ui-shadow");
                    spn.AppendClass("ui-btn-corner-all");
                }
                else
                {
                    btn.RemoveClass("ui-btn-corner-all");
                    btn.RemoveClass("ui-shadow");
                    spn.RemoveClass("ui-btn-corner-all");
                }
                __standalone = value;
            }
        }

        public override Palette Palette
        {
            get
            {
                return __palette;
            }
            set
            {
                var template = "ui-btn-up-{0}";
                var dom = this.__domNode.SearchByName("btn");
                dom.ReplaceClass(StringExt.Format(template, this.__palette), StringExt.Format(template, value));
                this.__palette = value;
            }
        }

        public string[] events = new string[] { "onchange" };

        public DropDownList(string defaultText)
        {
            this.__palette = Palette.C;
            this.__domNode = RexToy.UI.Controls.DomNode.Create(new DomNodeCreateOptions()
            {
                tag = Tag.Div,
                className = "ui-select",
                items = new DomNodeCreateOptions[]{
                new DomNodeCreateOptions()
                {
                    tag= Tag.Div,
                    hashName= "btn",
                    className= "ui-btn ui-btn-icon-right ui-btn-corner-all ui-shadow ui-btn-up-c",
                    items= new DomNodeCreateOptions[]
                    {
                        new DomNodeCreateOptions()
                        {
                            tag= Tag.Span,
                            hashName= "spn",
                            className= "ui-btn-inner ui-btn-corner-all",
                            items= new DomNodeCreateOptions[]
                            {
                                new DomNodeCreateOptions()
                                {
                                    tag= Tag.Span,
                                    className= "ui-btn-text",
                                    hashName= "text",
                                    innerHTML= defaultText ?? ""
                                },
                                new DomNodeCreateOptions()
                                {
                                    tag= Tag.Span,
                                    className= "ui-icon ui-icon-arrow-d ui-icon-shadow"
                                }
                            }
                        },
                        new DomNodeCreateOptions()
                        {
                            tag= Tag.Select,
                            hashName= "selector"
                        }
                    }
                }
            }
            });

            var domSel = this.__domNode.SearchByName("selector");
            domSel.AttachEvent(DomEvent.OnChange, new Action(this.OnChange).Bind(this));
            var domBtn = this.__domNode.SearchByName("btn");
            domBtn.AttachEvent(DomEvent.OnMouseOut, new Action(this.OnMouseOut).Bind(this));
            domBtn.AttachEvent(DomEvent.OnMouseOver, new Action(this.OnMouseOver).Bind(this));
        }

        private void OnMouseOut()
        {
            var domBtn = this.__domNode.SearchByName("btn");
            domBtn.ReplaceClass(StringExt.Format("ui-btn-hover-{0}", this.__palette), StringExt.Format("ui-btn-up-{0}", this.__palette));
        }

        private void OnMouseOver()
        {
            var domBtn = this.__domNode.SearchByName("btn");
            domBtn.ReplaceClass(StringExt.Format("ui-btn-up-{0}", this.__palette), StringExt.Format("ui-btn-hover-{0}", this.__palette));
        }

        public void AppendChoice(string text, object value)
        {
            var dom = this.__domNode.SearchByName("selector");
            var option = RexToy.UI.Controls.DomNode.Create(new DomNodeCreateOptions()
            {
                tag = Tag.Option,
                value = value ?? text,
                innerHTML = text
            });
            dom.AppendChild(option);
        }

        public void RemoveChoice(object value)
        {
            var dom = this.__domNode.SearchByName("selector");
            var arr = dom.GetChildren();
            for (var i = 0; i < arr.Length; i++)
            {
                var op = arr[i]._element as System.Html.DOM.Option;
                if (op.Value == value)
                {
                    dom.RemoveChild(arr[i]);
                    break;
                }
            }
        }

        public void ClearChoice()
        {
            var dom = this.__domNode.SearchByName("selector");
            dom.ClearChildren();
        }

        private void OnChange()
        {
            var sel = this.__domNode.SearchByName("selector")._element as System.Html.DOM.Select;
            var op = sel.Options[sel.SelectedIndex];
            var txt = this.__domNode.SearchByName("text");
            txt._element.InnerHTML = op.Text;

            this.__FireEvent("onchange");
        }

        public object GetSelectedValue()
        {
            var sel = this.__domNode.SearchByName("selector")._element as System.Html.DOM.Select;
            var op = sel.Options[sel.SelectedIndex];
            return op.Value;
        }

        public void SetSelectedValue(object val)
        {
            var sel = this.__domNode.SearchByName("selector")._element as System.Html.DOM.Select;
            var ops = sel.Options;
            for (var i = 0; i < ops.Length; i++)
            {
                if (ops[i].Value == val)
                {
                    sel.SelectedIndex = i;
                    var txt = this.__domNode.SearchByName("text");
                    txt._element.InnerHTML = ops[i].Text;
                    this.__FireEvent("onchange");
                    break;
                }
            }
        }
    }
}
